/* 全局样式 */
:root {
  --primary-color: #409eff;
  --success-color: #67c23a;
  --warning-color: #e6a23c;
  --danger-color: #f56c6c;
  --info-color: #909399;
  --text-color: #303133;
  --text-color-secondary: #606266;
  --border-color: #dcdfe6;
  --background-color: #f5f7fa;
}

* {
  box-sizing: border-box;
}

.page-container {
  padding: 20px;
}

.card-shadow {
  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}

/* 布局相关 */
.d-flex {
  display: flex;
}

.flex-column {
  flex-direction: column;
}

.justify-between {
  justify-content: space-between;
}

.justify-center {
  justify-content: center;
}

.align-center {
  align-items: center;
}

.flex-1 {
  flex: 1;
}

/* 间距 */
.mb-10 {
  margin-bottom: 10px;
}

.mb-20 {
  margin-bottom: 20px;
}

.mt-10 {
  margin-top: 10px;
}

.mt-20 {
  margin-top: 20px;
}

.ml-10 {
  margin-left: 10px;
}

.mr-10 {
  margin-right: 10px;
}

/* 文字相关 */
.text-primary {
  color: var(--primary-color);
}

.text-success {
  color: var(--success-color);
}

.text-warning {
  color: var(--warning-color);
}

.text-danger {
  color: var(--danger-color);
}

.text-center {
  text-align: center;
}

.text-right {
  text-align: right;
}

.text-bold {
  font-weight: bold;
}

.text-sm {
  font-size: 12px;
}

.text-md {
  font-size: 14px;
}

.text-lg {
  font-size: 16px;
}

.text-xl {
  font-size: 18px;
} 

/* 打印预览模式样式 */
html.print-preview-mode {
  font-size: 14px;
}

/* 打印样式 */
@media print {
  body {
    margin: 0;
    padding: 0;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
    color-adjust: exact !important;
  }
  
  /* 隐藏不需要打印的元素 */
  .el-dialog__wrapper,
  .el-message,
  .el-notification {
    display: none !important;
  }
  
  /* 确保分隔线打印正常 */
  .divider-line {
    border-bottom: 1px dashed #ccc !important;
    margin: 8px 0 !important;
    display: block !important;
    width: 100% !important;
    page-break-inside: avoid !important;
  }
  
  /* 确保表格打印正常 */
  table {
    border-collapse: collapse !important;
    width: 100% !important;
  }
  
  /* 确保文字居中 */
  .text-center, .shop-title, .footer-info {
    text-align: center !important;
  }
  
  /* 确保二维码居中 */
  .qrcode {
    text-align: center !important;
  }
  
  .qrcode-image {
    margin: 0 auto !important;
    display: block !important;
  }
} 